<template>
  <div class="home">
    <div class="org-content">
      <div style="width: 260px" class="tree-left">
        <el-card class="box-card tree-wrapper my-card" shadow="never">
          <div class="tree-style">
            <div class="tree-title">
              {{ treeTitle }}
              <span class="tree-title-btn">
                <i
                  class="el-icon-edit-outline bt-edit"
                  title="编辑"
                  @click="() => handleEditOrg()"
                />
                <i
                  class="el-icon-delete bt-delete"
                  @click="() => handleDelOrg()"
                  title="删除"
                />
                <i
                  class="el-icon-circle-plus-outline bt-add"
                  title="新增"
                  @click="() => handleAddOrg()"
                />
              </span>
            </div>
            <el-scrollbar class="tree-scrollbar">
              <el-tree
                ref="type"
                :data="typeOptions"
                node-key="id"
                empty-text="加载中，请稍后"
                :props="defaultProps"
                highlight-current
                :expand-on-click-node="false"
                :default-expanded-keys="expandDefault"
                @node-click="handleNodeClick"
                class="head-container"
                :indent="6"
              >
                <span
                  class="custom-tree-node"
                  @mouseenter="mouseenter(data)"
                  @mouseleave="mouseleave(data)"
                  slot-scope="{ node, data }"
                >
                  <el-tooltip
                    class="item"
                    effect="dark"
                    :content="node.label"
                    placement="top"
                    :open-delay="delay"
                  >
                    <span class="node-title">
                      <span>{{ node.label }}</span>
                    </span>
                  </el-tooltip>
                  <span class="tree-bts"> </span>
                </span>
              </el-tree>
            </el-scrollbar>
          </div>
        </el-card>
      </div>
      <div style="flex: 1; padding-left: 10px" class="tree-right">
        <el-card class="my-card" shadow="never">
          <table class="sub-top-table">
            <tr>
              <th>机构名称</th>
              <td colspan="2">{{ orgInfoForm.orgName }}</td>
              <th>预设编制总数</th>
              <td colspan="2">{{ orgInfoForm.realOrgan }}</td>
              <th>实际人数总数</th>
              <td colspan="2">{{ orgInfoForm.realPerson }}</td>
            </tr>
            <tr>
              <th>机构级别</th>
              <td colspan="2">
                <dict-tag
                  :options="dict.type.org_level"
                  :value="orgInfoForm.orgLevel"
                />
              </td>
              <th>机构类型</th>
              <td colspan="2">
                <dict-tag
                  :options="dict.type.org_type"
                  :value="orgInfoForm.orgType"
                />
              </td>
              <th>实际高配人数</th>
              <td colspan="2">{{ orgInfoForm.highPersonCount }}</td>
            </tr>
            <tr>
              <th></th>
              <th colspan="2">行政</th>
              <th colspan="2">单列</th>
              <th colspan="2">工勤</th>
              <th colspan="2">事业</th>
            </tr>
            <tr>
              <th>预设编制</th>
              <td colspan="2">{{ orgInfoForm.organizationAdmin.plan }}</td>
              <td colspan="2">{{ orgInfoForm.organizationSingle.plan }}</td>
              <td colspan="2">{{ orgInfoForm.organizationWork.plan }}</td>
              <td colspan="2">{{ orgInfoForm.organizationCause.plan }}</td>
            </tr>
            <tr>
              <th>实配编制</th>
              <td colspan="2">{{ orgInfoForm.organizationAdmin.existing }}</td>
              <td colspan="2">{{ orgInfoForm.organizationSingle.existing }}</td>
              <td colspan="2">{{ orgInfoForm.organizationWork.existing }}</td>
              <td colspan="2">{{ orgInfoForm.organizationCause.existing }}</td>
            </tr>
            <tr>
              <th>超空编制</th>
              <td colspan="2">{{ orgInfoForm.organizationAdmin.state }}</td>
              <td colspan="2">{{ orgInfoForm.organizationSingle.state }}</td>
              <td colspan="2">{{ orgInfoForm.organizationWork.state }}</td>
              <td colspan="2">{{ orgInfoForm.organizationCause.state }}</td>
            </tr>

            <tr>
              <th></th>
              <th>部门领导正职</th>
              <th>部门领导副职</th>
              <th colspan="2">与部门领导同级别的其他领导</th>
              <th>内设机构领导正职</th>
              <th>内设机构领导副职</th>
              <th colspan="2">与内设机构领导同级别的其他领导</th>
            </tr>
            <tr>
              <th>应配</th>
              <td>{{ orgInfoForm.departmentLead.plan }}</td>
              <td>{{ orgInfoForm.departmentLeadDeputy.plan }}</td>
              <td colspan="2">{{ orgInfoForm.sameDepartmentLead.plan }}</td>
              <td>{{ orgInfoForm.internalLead.plan }}</td>
              <td>{{ orgInfoForm.internalLeadDeputy.plan }}</td>
              <td colspan="2">{{ orgInfoForm.sameInternalLead.plan }}</td>
            </tr>
            <tr>
              <th>实配</th>
              <td>{{ orgInfoForm.departmentLead.existing }}</td>
              <td>{{ orgInfoForm.departmentLeadDeputy.existing }}</td>
              <td colspan="2">{{ orgInfoForm.sameDepartmentLead.existing }}</td>
              <td>{{ orgInfoForm.internalLead.existing }}</td>
              <td>{{ orgInfoForm.internalLeadDeputy.existing }}</td>
              <td colspan="2">{{ orgInfoForm.sameInternalLead.existing }}</td>
            </tr>
            <tr>
              <th>超空</th>
              <td>{{ orgInfoForm.departmentLead.state }}</td>
              <td>{{ orgInfoForm.departmentLeadDeputy.state }}</td>
              <td colspan="2">{{ orgInfoForm.sameDepartmentLead.state }}</td>
              <td>{{ orgInfoForm.internalLead.state }}</td>
              <td>{{ orgInfoForm.internalLeadDeputy.state }}</td>
              <td colspan="2">{{ orgInfoForm.sameInternalLead.state }}</td>
            </tr>
          </table>
          <el-card class="box-card" shadow="always" style="margin-top: 10px">
            <el-form ref="queryForm" :model="queryParams" label-width="68px">
              <!--<el-form-item>-->
              <!--  <el-button-->
              <!--    v-for="dict in dict.type.person_status"-->
              <!--    :key="dict.value"-->
              <!--    :label="dict.label"-->
              <!--    :value="dict.value"-->
              <!--    @click="statusBtn(dict.value)"-->
              <!--  >-->
              <!--    {{ dict.label }}-->
              <!--  </el-button>-->
              <!--</el-form-item>-->
              <el-row>
                <el-col :span="24">
                  <el-row :gutter="10">
                    <el-col :span="6">
                      <el-form-item label-width="50px"
                        label="姓名"
                        prop="name"
                        style="margin-left: 10px"
                      >
                        <el-input
                          v-model="queryParams.name"
                          placeholder="请输入姓名"
                          size="small"
                          @keyup.enter.native="handleQuery"
                        />
                      </el-form-item>
                    </el-col>
                    <el-col :span="7">
                      <el-form-item label="身份证号" prop="identityNo">
                        <el-input
                          v-model="queryParams.identityNo"
                          placeholder="请输入身份证号"
                          size="small"
                          @keyup.enter.native="handleQuery"
                        />
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="状态" prop="status" label-width="50px">
                        <el-select
                          v-model="queryParams.status"
                          placeholder="请选择人员状态"
                          size="small"
                        >
                          <el-option
                            v-for="dict in dict.type.person_status"
                            :key="dict.value"
                            :label="dict.label"
                            :value="dict.value"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                  </el-row>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-row :gutter="10">
                    <el-col :span="6">
                      <el-form-item label="学历" prop="education" label-width="50px" style="margin-left: 10px">
                        <el-input
                          v-model="queryParams.education"
                          placeholder="请输入学历"
                          size="small"
                          @keyup.enter.native="handleQuery"
                        />
                      </el-form-item>
                    </el-col>
                    <el-col :span="7">
                      <el-form-item label="年龄范围" prop="name">
                        <el-input style="width: 100px" v-model="queryParams.startAge" type="number"></el-input>
                        -
                        <el-input style="width: 100px" v-model="queryParams.endAge" type="number"></el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="性别" prop="status" label-width="50px">
                        <el-select
                          v-model="queryParams.sex"
                          placeholder="请选择性别"
                          size="small"
                        >
                          <el-option
                            v-for="dict in sexOptions"
                            :key="dict.value"
                            :label="dict.label"
                            :value="dict.value"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="5">
                      <el-form-item label-width="0">
                        <!--                    <el-form-item>
                          <el-button
                            type="primary"
                            icon="el-icon-plus"
                            size="small"
                            @click="handleAdd"
                          >新增</el-button
                          >
                        </el-form-item>-->
                        <el-button
                          type="primary"
                          icon="el-icon-search"
                          size="small"
                          @click="handleQuery"
                        >搜索</el-button
                        >
                        <el-button
                          icon="el-icon-refresh"
                          size="small"
                          @click="resetQuery"
                        >重置</el-button
                        >
                      </el-form-item>
                    </el-col>
                  </el-row>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label-width="0" style="margin-left: 10px">
                    <el-button-group>
                      <el-button
                        type="primary"
                        icon="el-icon-plus"
                        size="small"
                        @click="handleAdd"
                      >新增</el-button
                      >
                      <el-button
                        type="success"
                        icon="el-icon-folder-add"
                        size="small"
                        @click="handleImport"
                      >文件导入</el-button
                      >
                      <el-button
                        type="info"
                        icon="el-icon-upload2"
                        size="small"
                        @click="exportCustomBtn"
                      >导出</el-button
                      >
                    </el-button-group>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>

            <el-table
              v-loading="loading"
              :data="personList"
              tooltip-effect="dark"
              style="width: 100%; margin-top: 5px"
            >
              <el-table-column label="姓名" min-width="60">
                <template slot-scope="scope">
                  <span>{{ scope.row.name }}</span>
                </template>
              </el-table-column>
              <el-table-column label="所在部门" min-width="80" show-overflow-tooltip>
                <template slot-scope="scope">
                  <span>{{ scope.row.orgName }}</span>
                </template>
              </el-table-column>
              <el-table-column label="身份证号" min-width="80">
                <template slot-scope="scope">
                  <span>{{ scope.row.identityNo }}</span>
                </template>
              </el-table-column>
              <el-table-column label="性别" min-width="60">
                <template slot-scope="scope">
                  <span v-if="scope.row.sex === '0'">女</span>
                  <span v-if="scope.row.sex === '1'">男</span>
                </template>
              </el-table-column>
              <el-table-column label="职务名称" min-width="100">
                <template slot-scope="scope">
                  <span>{{ scope.row.positionTitle }}</span>
                </template>
              </el-table-column>
              <el-table-column label="职级层次" min-width="100">
                <template slot-scope="scope">
                  <span>{{ scope.row.jobLevelSmallLabel }}</span>
                </template>
              </el-table-column>
              <el-table-column label="状态" width="60">
                <template slot-scope="scope">
                  <dict-tag
                    :options="dict.type.person_status"
                    :value="scope.row.status"
                  />
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                class-name="fixed-width"
                align="left"
                width="130"
              >
                <template slot-scope="scope">
                  <el-button-group>
                    <el-button
                      size="medium"
                      type="text"
                      style="color: green; margin-right: 10px"
                      @click="detailPerson(scope.row)"
                      >详情</el-button
                    >
                    <el-button
                      size="medium"
                      type="text"
                      style="margin-right: 10px"
                      @click="editPerson(scope.row)"
                      >修改</el-button
                    >
                    <el-button
                      size="medium"
                      type="text"
                      @click="deletePerson(scope.row)"
                      style="color: red"
                      >删除</el-button
                    >
                  </el-button-group>
                </template>
              </el-table-column>
            </el-table>

            <el-pagination
              :page-sizes="[5, 10, 20, 50, 100]"
              layout="total, sizes, prev, pager, next, jumper"
              :current-page.sync="queryParams.pageNum"
              :page-size.sync="queryParams.pageSize"
              :total="total"
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
            />
          </el-card>
        </el-card>
      </div>

      <!--人员弹框-->
      <el-dialog
        :title="personDialog.title"
        :visible.sync="personDialog.open"
        width="710px"
        append-to-body
      >
        <el-row>
          <el-form
            ref="personForm"
            :model="personForm"
            :rules="personRules"
            :disabled="personDialog.disabled"
            label-width="80px"
          >
            <el-row>
              <el-col :span="12">
                <el-form-item label="姓名" prop="name">
                  <el-input
                    v-model="personForm.name"
                    placeholder="请输入姓名"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="性别" prop="">
                  <el-radio-group v-model="personForm.sex" >
                    <el-radio label="0">女</el-radio>
                    <el-radio label="1">男</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="身份证号" prop="identityNo">
                  <el-input
                    v-model="personForm.identityNo"
                    placeholder="请输入身份证号"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="出生日期" prop="" v-if="personForm.birthDate">
                  <el-input
                    v-model="personForm.birthDate"
                    placeholder="请输入出生日期"
                    :disabled="true"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="学历" prop="">
                  <el-input
                    v-model="personForm.education"
                    placeholder="请输入学历"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="职务名称" prop="">
                  <el-input
                    v-model="personForm.positionTitle"
                    placeholder="请输入职务名称"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="警号" prop="">
                  <el-input
                    v-model="personForm.policeNo"
                    placeholder="请输入警号"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="警衔" prop="jobTitle">
                  <el-select
                    v-model="personForm.jobTitle"
                    placeholder="警衔"
                    clearable
                  >
                    <el-option
                      v-for="dict in dict.type.person_title_type"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="所在部门" prop="">
                  <el-select v-model="personForm.orgId" :disabled="personOrgDisable">
                    <el-option
                      v-for="org in personOrgOptions"
                      :key="org.id"
                      :label="org.orgName"
                      :value="org.id"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="职务层次" prop="jobLevel" :inline="true">
                  <el-select
                    v-model="personForm.postBigCateCode"
                    placeholder="请选择职务层次"
                    @change="bigPostSelectChange"
                    clearable
                    style="width: 255px"
                  >
                    <el-option
                      v-for="dict in dict.type.post_big_cate_code"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    ></el-option>
                  </el-select>
                  <span> — </span>
                  <el-select
                    v-model="personForm.postSmallCateCode"
                    placeholder="请选择职务层次"
                    clearable
                    style="width: 240px"
                  >
                    <el-option
                      v-for="dict in postSmallOption"
                      :key="dict.dictValue"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="职级层次" prop="jobLevel" :inline="true">
                  <el-select
                    v-model="personForm.jobLevel"
                    placeholder="请选择职级层次"
                    @change="bigLevelSelectChange"
                    clearable
                    style="width: 255px"
                  >
                    <el-option
                      v-for="dict in dict.type.person_level_big_level"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    ></el-option>
                  </el-select>
                  <span> — </span>
                  <el-select
                    v-model="personForm.jobLevelSmall"
                    placeholder="请选择职级层次"
                    clearable
                    style="width: 240px"
                  >
                    <el-option
                      v-for="dict in jobLevelSmallOption"
                      :key="dict.dictValue"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="领导类型" prop="leaderType">
                  <el-select
                    v-model="personForm.leaderType"
                    placeholder="请选择领导类型"
                    clearable
                  >
                    <el-option
                      v-for="dict in dict.type.leader_type"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="联系方式" prop="">
                  <el-input
                    v-model="personForm.contactPhone"
                    placeholder="请输入联系方式"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="人员状态" prop="status">
                  <el-select
                    v-model="personForm.status"
                    placeholder="请选择人员状态"
                    clearable
                  >
                    <el-option
                      v-for="dict in dict.type.person_status"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-row>
        <div slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            @click="submitPersonForm"
            v-show="!personDialog.disabled"
            >确 定</el-button
          >
          <el-button @click="personDialog.open = false">取 消</el-button>
        </div>
      </el-dialog>

      <!--机构弹框-->
      <el-dialog
        :title="orgDialog.title"
        :visible.sync="orgDialog.open"
        width="1200px"
        append-to-body
      >
        <el-form
          ref="orgForm"
          :model="orgForm"
          :rules="orgRules"
          label-width="80px"
          label-position="right"
        >
          <el-row>
            <el-col :span="6">
              <el-form-item label="机构名称" prop="orgName">
                <el-input
                  v-model="orgForm.orgName"
                  placeholder="请输入机构名称"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="机构级别" prop="orgLevel">
                <el-select
                  v-model="orgForm.orgLevel"
                  placeholder="请选择机构级别"
                  @change="addSelectRule"
                  clearable
                >
                  <el-option
                    v-for="dict in dict.type.org_level"
                    :key="dict.value"
                    :label="dict.label"
                    :value="dict.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="机构类型" prop="orgLevel">
                <el-select
                  v-model="orgForm.orgType"
                  placeholder="请选择机构类型"
                  clearable
                >
                  <el-option
                    v-for="dict in dict.type.org_type"
                    :key="dict.value"
                    :label="dict.label"
                    :value="dict.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
<!--            <el-button type="primary" v-if="showAddBtn" @click="setOrg" style="margin-left: 10px">添加机构</el-button>-->
          </el-row>

          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>预设编制</span>
            </div>
            <div style="margin-left: -20px">
              <el-row>
                <el-col :span="6">
                  <el-form-item label="行政" prop="organizationAdmin">
                    <el-input-number v-model="orgForm.organizationAdmin" :disabled="isDisabled"
                                     @change="(currentValue, oldValue)=>{toAdjust(currentValue, oldValue,'xz')}">
                    </el-input-number>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="单列" prop="organizationSingle">
                    <el-input-number v-model="orgForm.organizationSingle"  :disabled="isDisabled"
                                     @change="(currentValue, oldValue)=>{toAdjust(currentValue, oldValue,'dl')}">
                    </el-input-number>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="工勤" prop="organizationWork">
                    <el-input-number v-model="orgForm.organizationWork" :disabled="isDisabled"
                                     @change="(currentValue, oldValue)=>{toAdjust(currentValue, oldValue,'gq')}">
                    </el-input-number>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="事业" prop="organizationCause">
                    <el-input-number v-model="orgForm.organizationCause" :disabled="isDisabled"
                                     @change="(currentValue, oldValue,)=>{toAdjust(currentValue, oldValue,'sy')}">
                    </el-input-number>
                  </el-form-item>
                </el-col>
              </el-row>
            </div>
          </el-card>

          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>预设职数</span>
            </div>
            <div style="margin-left: -20px">
              <el-row>
                <el-col :span="7">
                  <el-form-item
                    label="部门领导正职"
                    prop="departmentLead"
                    label-width="140px"
                  >
                    <el-input-number
                      v-model="orgForm.departmentLead"
                      style="width: 150px"
                    >
                    </el-input-number>
                  </el-form-item>
                </el-col>
                <el-col :span="7">
                  <el-form-item
                    label="部门领导副职"
                    prop="departmentLeadDeputy"
                    label-width="140px"
                  >
                    <el-input-number
                      v-model="orgForm.departmentLeadDeputy"
                      style="width: 150px"
                    >
                    </el-input-number>
                  </el-form-item>
                </el-col>
                <el-col :span="10">
                  <el-form-item
                    label="与部门领导同级别的其他领导"
                    prop="sameDepartmentLead"
                    label-width="240px"
                  >
                    <el-input-number
                      v-model="orgForm.sameDepartmentLead"
                      style="width: 150px"
                    >
                    </el-input-number>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="7">
                  <el-form-item
                    label="内设机构领导正职"
                    prop="internalLead"
                    label-width="140px"
                  >
                    <el-input-number
                      v-model="orgForm.internalLead"
                      style="width: 150px"
                    >
                    </el-input-number>
                  </el-form-item>
                </el-col>
                <el-col :span="7">
                  <el-form-item
                    label="内设机构领导副职"
                    prop="internalLeadDeputy"
                    label-width="140px"
                  >
                    <el-input-number
                      v-model="orgForm.internalLeadDeputy"
                      style="width: 150px"
                    >
                    </el-input-number>
                  </el-form-item>
                </el-col>
                <el-col :span="10">
                  <el-form-item
                    label="与内设机构领导同级别的其他领导"
                    prop="sameInternalLead"
                    label-width="240px"
                  >
                    <el-input-number
                      v-model="orgForm.sameInternalLead"
                      style="width: 150px"
                    >
                    </el-input-number>
                  </el-form-item>
                </el-col>
              </el-row>
            </div>
          </el-card>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitOrgForm">确 定</el-button>
          <el-button @click="orgDialog.open = false">取 消</el-button>
        </div>
      </el-dialog>

      <!--机构分配弹框-->
      <el-dialog
        :title="orgAssignDialog.title"
        :visible.sync="orgAssignDialog.open"
        width="1200px"
        :before-close="cancelOrg"
        append-to-body
      >
        <el-form
          ref="orgAssignForm"
          :model="orgAssignForm"
          :rules="orgRules"
          label-width="100px"
          label-position="right"
        >
          <el-row>
            <el-col :span="6">
              <el-form-item label="预增编制数" prop="organizationAdmin">
                <el-input-number type="number" :min=0 v-model="orgAssignForm.sumAssign" :disabled="isDisabled" @change="sumChange">
                </el-input-number>
              </el-form-item>
            </el-col>
            <el-col :span="3" style="margin-left: 20px">
              <el-form-item label="已分配编制" >
               <div>{{  orgAssignForm.hasAssign }} <span>人</span></div>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="未分配编制">
                <div>{{ orgAssignForm.noAssign  }} <span>人</span></div>
              </el-form-item>
            </el-col>
          </el-row>

          <el-table :data="tableData" border stripe style="width: 100%;">
            <el-table-column prop="name" label="编号" min-width="20">
              <template slot-scope="scope">
                <div> {{scope.$index+1}}</div>
              </template>

            </el-table-column>
            <el-table-column prop="orgAssignId" label="机构分配">
              <template slot-scope="scope">
                <el-cascader ref="cascader"
                  placeholder="搜索"
                  :options="orgsList"
                  filterable clearable  v-model="scope.row.orgAssignId"
                  :show-all-levels="false"
                  :props="{ multiple: false, emitPath: false, value: 'id',label:'orgName' }"
                  :disabled="!scope.row.edit"
                  @change="orgChange"
                ></el-cascader>
              </template>
            </el-table-column>
            <el-table-column prop="weaveNum" label="编制分配">

              <template slot-scope="scope">
                <el-input-number type="number" :min=0 :max="orgAssignForm.sumAssign>=0?cs1(scope.$index):Infinity"
                                 v-model="scope.row.weaveNum" :disabled="(scope.row.edit==false)||(!scope.row.orgAssignId)"
                                 @change="(currentValue, oldValue,)=>{numChange(currentValue, oldValue,scope.$index)}">
                </el-input-number>
                <span style="color: red;margin-left: 10px" v-if="scope.row.oor">超编</span>
              </template>
            </el-table-column>
            <el-table-column label="操作">
              <template slot-scope="scope">
                <el-button type="text" size="medium" @click="deleteData(scope.row,scope.$index)">
                  <i class="el-icon-delete" aria-hidden="true"></i>
                </el-button>
<!--                <el-button v-if="scope.row.edit" type="text" size="medium" @click="confirmAdd(scope.row)">-->
<!--                  <i class="el-icon-check" aria-hidden="true"></i>-->
<!--                </el-button>-->
<!--                <div v-else>-->
<!--                  <el-button type="text" size="medium" @click="editData(scope.row)">-->
<!--                    <i class="el-icon-edit" aria-hidden="true"></i>-->
<!--                  </el-button>-->
<!--                  <el-button type="text" size="medium" @click="deleteData(scope.row,scope.$index)">-->
<!--                    <i class="el-icon-delete" aria-hidden="true"></i>-->
<!--                  </el-button>-->
<!--                </div>-->
              </template>
            </el-table-column>
          </el-table>
          <el-button type="text" @click="addData">新增+</el-button>
          <el-divider></el-divider>
<!--          <el-button @click="submitData">提交 </el-button>-->


        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitData">确 定</el-button>
          <el-button @click="cancelOrg">取 消</el-button>
        </div>
      </el-dialog>

      <!--导出弹框-->
      <el-dialog
        :title="exportDialog.title"
        :visible.sync="exportDialog.open"
        width="710px"
        append-to-body
      >
        <el-row>
          <el-form
            ref="exportForm"
            label-width="80px"
          >
            <!--<el-col :span="24">-->
            <!--  <el-form-item label="领导类型" prop="name">-->
            <!--    <el-select-->
            <!--      v-model="exportForm.leaderType"-->
            <!--      placeholder="请选择领导类型"-->
            <!--      clearable-->
            <!--      multiple-->
            <!--    >-->
            <!--      <el-option-->
            <!--        v-for="dict in dict.type.leader_type"-->
            <!--        :key="dict.value"-->
            <!--        :label="dict.label"-->
            <!--        :value="dict.value"-->
            <!--      ></el-option>-->
            <!--    </el-select>-->
            <!--  </el-form-item>-->
            <!--</el-col>-->
            <el-col :span="24">
              <el-form-item label="导出列" prop="name">
                <el-checkbox-group v-model="exportForm.exportColumn" :min="1">
                  <el-checkbox v-for="column in allExportColumn" :label="column.englishName" :key="column.englishName" :value="column.englishName">
                    {{column.chineseName}}
                  </el-checkbox>
                </el-checkbox-group>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
        <div slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            @click="exportCustom"
          >确 定</el-button
          >
          <el-button @click="exportDialog.open = false">取 消</el-button>
        </div>
      </el-dialog>

      <file-import @file-import="getPersonPage" ref="fileImport"></file-import>
    </div>
  </div>
</template>

<script>
import {
  selectRule,
  addOrg,
  deleteOrg,
  listOrgTree,
  updateOrg,
  queryOrgDetailView,
  getOrgs,
  orgDistribute,
} from "@/api/modules/org";
import {
  addPerson,
  deletePerson,
  listPersonPage,
  updatePerson,
} from "@/api/modules/person";
import { getDicts } from "@/api/system/dict/data";
import FileImport from "@/views/org/components/FileImport.vue";
import {getSameLevelOrg} from "@/api/orgadjust";

export default {
  name: "Index",
  components: {FileImport},
  dicts: [
    "org_level",
    "org_type",
    "person_level_big_level",
    "person_title_type",
    "person_status",
    "post_big_cate_code",
    "leader_type",
  ],
  data() {
    return {
      orgAssignForm:{
        mode:0,  //0为增加，1为减少
        sumAssign:10,
        hasAssign:0,
        noAssign:0,
        orgType:'',
        currLimit:0
      },
      tableData:[
        // {
        //   // idnum:111,
        //   // orgAssignId:1,
        //   // weaveNum:333
        // }
      ],
      orgsList:[],
      showAddBtn:true,

      // 版本号
      version: "3.8.2",
      treeTitle: "机构",
      typeOptions: [],
      isDisabled: false,
      defaultProps: {
        children: "children",
        label: "orgName",
      },
      treeTitleInfo: {
        id: "0",
      },
      delay: 500,
      orgDialog: {
        title: "新增机构",
        open: false,
      },
      orgAssignDialog: {
        title: "机构分配",
        open: false,
      },
      orgForm: {},

      orgRules: {
        orgName: [
          { required: true, message: "机构名称不能为空", trigger: "blur" },
        ],
        orgLevel: [
          { required: true, message: "机构级别不能为空", trigger: "change" },
        ],
        orgType: [
          { required: true, message: "机构类型不能为空", trigger: "change" },
        ],
      },
      orgInfoForm: {
        organizationAdmin: {},
        organizationSingle: {},
        organizationWork: {},
        organizationCause: {},
        departmentLead: {},
        departmentLeadDeputy: {},
        sameDepartmentLead: {},
        internalLead: {},
        internalLeadDeputy: {},
        sameInternalLead: {},
      },
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 20,
        name: "",
        identityNo: "",
        orgId: "",
        jobLevel: "",
        status: "",
        education: "",
        sex: "",
        startAge: null,
        endAge: null,
      },
      personList: [],
      loading: false,
      //人员弹框
      personDialog: {
        title: "人员新增",
        open: false,
        disabled: false,
      },
      tableBtnList: [
        "部、厅级",
        "处级",
        "科级",
        "股级",
        "高配",
        "离职",
        "调职",
        "殉职",
      ],
      personForm: {},
      personRules: {
        name: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
        policeNo: [
          { required: true, message: "警号不能为空", trigger: "blur" },
        ],
        identityNo: [
          { required: true, message: "身份证号不能为空", trigger: "blur" },
        ],
        contactPhone: [
          { required: true, message: "联系方式不能为空", trigger: "blur" },
        ],
        status: [
          { required: true, message: "人员状态不能为空", trigger: "change" },
        ],
      },
      total: 0,
      jobLevelSmallOption: [],
      postSmallOption: [],
      orgPid: "",
      orgId: "",
      addFlag: "",
      orgSelectPid: "",
      clickOrgName: "",
      saveOrgForm: {
        organizationAdmin: {},
        organizationSingle: {},
        organizationWork: {},
        organizationCause: {},
        departmentLead: {},
        departmentLeadDeputy: {},
        sameDepartmentLead: {},
        internalLead: {},
        internalLeadDeputy: {},
        sameInternalLead: {},
      },
      expandDefault: [],
      expandId: '',
      exportForm: {
        exportColumn: [],
        leaderType: [],
      },
      hideColumn: [],
      exportDialog: {
        title: "选择需要导出的内容",
        open: false,
      },
      allExportColumn: [
        { chineseName: "姓名", englishName: "name"},
        { chineseName: "身份证号", englishName: "identityNo"},
        { chineseName: "出生日期", englishName: "birthDate"},
        { chineseName: "年龄", englishName: "age"},
        { chineseName: "性别", englishName: "sex"},
        { chineseName: "警号", englishName: "policeNo"},
        { chineseName: "警衔", englishName: "jobTitle"},
        { chineseName: "学历", englishName: "education"},
        { chineseName: "职务层次-大类", englishName: "postBigCateCode"},
        { chineseName: "职务层次-小类", englishName: "postSmallCateCode"},
        { chineseName: "职级层次-大类", englishName: "jobLevel"},
        { chineseName: "职级层次-小类", englishName: "jobLevelSmall"},
        { chineseName: "联系方式", englishName: "contactPhone"},
        { chineseName: "领导类型", englishName: "leaderType"},
        { chineseName: "职务名称", englishName: "positionTitle"},
        { chineseName: "状态", englishName: "status"},
      ],
      allEngLishName: [],
      personOrgOptions: [],
      personOrgDisable: false,
      sexOptions: [
        {value: "0", label: "女"},
        {value: "1", label: "男"},
      ],
    };
  },
  watch: {
    // expandDefault(newVal, oldVal) {
    //   if (newVal) {
    //     this.$nextTick(() => {
    //       // 默认树的第一个展开
    //       // document.querySelector('.el-tree-node__content').click()
    //       // 默认第一个的子集展示
    //       document.querySelector('.el-tree-node__children .el-tree-node__content').click()
    //     });
    //   }
    // }

  },
  created() {
    this.getTree();
    this.allExportColumn.forEach(item => {
      this.exportForm.exportColumn.push(item.englishName)
      this.allEngLishName.push(item.englishName)
    })
  },
  computed: {


    cs1() {

      return (data) => {

        let allSelect = 0

        let maxQuantit = this.orgAssignForm.sumAssign

        this.tableData.forEach((item, index) => {

          if (index !== data) {

            allSelect += item.weaveNum

          }

        })

        return maxQuantit-allSelect

      }

    }

  },
  methods: {
    cancelOrg(){
      this.orgAssignForm =
          {
            mode:0,  //0为增加，1为减少
            sumAssign:10,
            hasAssign:0,
            noAssign:0,
            orgType:'',
            currLimit:0
          }
      this.tableData = []
      this.orgDialog.open = true
      this.orgAssignDialog.open=false
    },
    orgChange(val){
      let nodesObj = this.$refs['cascader'].getCheckedNodes()
      console.log(nodesObj[0].data)
      if (this.orgAssignForm.mode==1){
        switch (this.orgAssignForm.orgType){
          case "xz":
            this.orgAssignForm.currLimit = nodesObj[0].data.organizationAdmin
            break;
          case "dl":
            this.orgAssignForm.currLimit = nodesObj[0].data.organizationSingle
            break;
          case "gq":
            this.orgAssignForm.currLimit = nodesObj[0].data.organizationWork
            break;
          case "sy":
            this.orgAssignForm.currLimit = nodesObj[0].data.organizationCause
            break;
        }
      }
      console.log(this.orgAssignForm.currLimit )
    },
    toAdjust(newVal,oldVal,type){
      this.getTree()
      this.orgAssignForm.orgType = type
      this.orgAssignDialog.open = true
      this.orgDialog.open = false


      console.log(type)

      if (newVal-oldVal>0){
        this.orgAssignForm.mode = 0
        this.orgAssignDialog.title="机构分配(增加)"
      }else {
        this.orgAssignForm.mode = 1
        this.orgAssignDialog.title="机构分配(减少)"
      }
    },
    sumChange(cv,ov){
      this.orgAssignForm.noAssign = this.orgAssignForm.sumAssign - this.orgAssignForm.hasAssign
    },
    numChange(cv,ov,index){
      let sv = cv-ov
      console.log(index)
      if(cv>this.orgAssignForm.currLimit && this.orgAssignForm.mode==1){
        // this.$message.success("超出已有人数");
        this.tableData[index].oor=true
      }else {
        this.tableData[index].oor=false
      }
      this.orgAssignForm.hasAssign+=sv
      this.orgAssignForm.noAssign = this.orgAssignForm.sumAssign - this.orgAssignForm.hasAssign
    },
    //添加
    addData() {
      this.tableData.push({
        idnum:this.tableData.length+1,
        edit: true,
        weaveNum:0,
        type:this.orgAssignForm.mode,
        orgType:this.orgAssignForm.orgType,
        oor:false  //是否超出范围
      });
      console.log( this.tableData)
    },
    //确认添加
    confirmAdd(row) {
      row.edit = false;
    },
    //修改
    editData(row) {
      row.edit = true;
    },
    //删除
    deleteData(row, index) {
      console.log(row)
      this.orgAssignForm.hasAssign -= row.weaveNum
      this.orgAssignForm.noAssign = this.orgAssignForm.sumAssign - this.orgAssignForm.hasAssign
      this.tableData.splice(index, 1);
    },
    submitData() {
      // alert(JSON.stringify(this.tableData))
      let subData = this.tableData.map(data => { return { id: data.orgAssignId,count:data.weaveNum,type:'0',orgType:data.orgType} });
      if(this.orgAssignForm.hasAssign == this.orgAssignForm.sumAssign){
        orgDistribute(subData).then((res)=>{
          if (res.code==200){
            this.$message.success("修改成功");
            this.cancelOrg()

            this.$refs["orgForm"].validate((valid) => {
              if (valid) {
                if (this.orgForm.id) {
                  updateOrg(this.orgForm).then((response) => {
                    this.getTree();
                  });
                }
              }
            });
          }
        })
      }else {
        this.$message.error("尚有未分配的人员");
      }
    },

    addSelectRule(data) {
      selectRule({
        pid: this.orgPid,
        orgLevel: data,
        addFlag: this.addFlag,
      }).then((res) => {
        if (!res.data) {
          this.orgForm.orgLevel = undefined;
          this.$message({
            showClose: true,
            message: "不能选择比上级机构高的机构等级！",
            type: "warning",
          });
        }
      });
    },
    goTarget(href) {
      window.open(href, "_blank");
    },
    getTree() {

      getOrgs().then((res)=>{
        // console.log(res)
        this.orgsList = res.data
        this.orgAssignForm.noAssign = this.orgAssignForm.sumAssign - this.orgAssignForm.hasAssign
      })
      listOrgTree().then((response) => {
        this.typeOptions = response.data;
        if (this.expandId){
          this.$nextTick(() => {
            this.$refs.type.setCurrentKey(this.expandId)
            this.handleNodeClick(this.$refs.type.getCurrentNode())
          })
        }else {
          this.expandDefault.push(this.typeOptions[0].children[0].id)
        }
      });
    },
    statusBtn(status) {
      this.queryParams.status = status;
      this.getPersonPage();
    },
    levelBtn(level) {
      this.queryParams.jobLevel = level;
      this.getPersonPage();
    },
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getPersonPage();
    },
    bigLevelSelectChange(bigLevel) {
      this.personForm.jobLevelSmall = undefined;
      if (bigLevel !== "") {
        getDicts(bigLevel).then((res) => {
          this.jobLevelSmallOption = res.data;
        });
      }
    },
    bigLevelChange(bigLevel) {
      getDicts(bigLevel).then((res) => {
        this.jobLevelSmallOption = res.data;
      });
    },
    bigPostChange(bigPost) {
      getDicts(bigPost).then((res) => {
        this.postSmallOption = res.data;
      });
    },
    bigPostSelectChange(bigPost) {
      this.personForm.postSmallCateCode = undefined;
      if (bigPost !== "") {
        getDicts(bigPost).then((res) => {
          this.postSmallOption = res.data;
        });
      }
    },
    resetQuery() {
      this.queryParams = {
        pageNum: 1,
        pageSize: 20,
        name: "",
        identityNo: "",
        orgId: this.queryParams.orgId,
        jobLevel: "",
        status: "",
      };
      this.getPersonPage();
    },
    /** 结点单击事件 */
    handleNodeClick(data) {
      this.expandDefault = []
      this.expandId = this.$refs.type.getCurrentKey()
      this.expandDefault.push(this.expandId)
      console.log("handleNodeClick", data);
      this.loading = true;
      this.queryParams.orgId = data.id;
      this.clickOrgName = data.orgName
      this.queryParams.pageNum = 1;
      this.getPersonPage();
      this.orgForm = JSON.parse(JSON.stringify(data));
      this.orgPid = data.pid;
      this.orgSelectPid = data.pid;
      this.addFlag = "0";
      this.orgId = data.id;

      console.log(data, "点击信息");
      queryOrgDetailView({ orgId: data.id }).then((response) => {
        if (response.code == 200) {
          var realPerson = response.data.realPerson;
          var overTotal = response.data.realOrgan - response.data.realPerson;
          var overStr = "";
          if (overTotal > 0) {
            overStr = "(空编数:" + overTotal + ")";
            response.data.realPerson = realPerson + overStr;
          } else if (overTotal < 0) {
            overStr = "(超编数:" + Math.abs(overTotal) + ")";
            response.data.realPerson = realPerson + overStr;
          }
          this.orgInfoForm = response.data;
        }
      });
    },
    IdCardCount(IdCard,type){
      /*
      * 当type=1时获取出生日期,type=2时获取性别,type=3时获取年龄
      * */
      if (type === 1) {
        //获取出生日期
        let birthday = IdCard.substring(6, 10) + "年" + IdCard.substring(10, 12) + "月" + IdCard.substring(12, 14) + '日'
        return birthday
      }
      if (type === 2) {
        //获取性别
        if (parseInt(IdCard.substr(16, 1)) % 2 === 1) {
          return "男"
        } else {
          return "女"
        }
      }
      if (type === 3) {
        //获取年龄
        var ageDate = new Date()
        var month = ageDate.getMonth() + 1
        var day = ageDate.getDate()
        var age = ageDate.getFullYear() - IdCard.substring(6, 10) - 1
        if (IdCard.substring(10, 12) < month || IdCard.substring(10, 12) === month && IdCard.substring(12, 14) <= day) {
          age++
        }
        if (age <= 0) {
          age = 1
        }
        return '(' + age + '岁' + ')'
      }
    },
    getPersonPage() {
      this.loading = true
      listPersonPage(this.queryParams).then((response) => {
        this.personList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    detailPerson(data) {
      this.personOrgDisable = true
      this.personDialog.title = "人员详情";
      if (data.postBigCateCode) {
        this.bigPostChange(data.postBigCateCode);
      }
      if (data.jobLevel) {
        this.bigLevelChange(data.jobLevel);
      }
      this.personDialog.open = true;
      this.personDialog.disabled = true;
      this.personForm = JSON.parse(JSON.stringify(data));
      this.personForm.orgId = this.personForm.orgName
      if (data.identityNo){
        this.personForm.birthDate = this.IdCardCount(data.identityNo,1) + this.IdCardCount(data.identityNo,3)
      }
    },
    editPerson(data) {
      this.personOrgDisable = false
      this.personDialog.title = "修改人员";
      this.personDialog.disabled = false;
      this.personDialog.open = true;
      this.personForm = JSON.parse(JSON.stringify(data));
      if (data.jobLevel) {
        this.bigLevelChange(data.jobLevel);
      }
      if (data.postBigCateCode) {
        this.bigPostChange(data.postBigCateCode);
      }
      getSameLevelOrg(this.personForm.orgId).then((res) => {
        this.personOrgOptions = []
        this.personOrgOptions = res.data
      })
    },
    deletePerson(data) {
      this.$confirm(
        "点击确认后，此人员会被永久删除, 请确认此项操作？",
        "删除人员",
        {
          confirmButtonText: "确认",
          cancelButtonText: "取消",
          type: "warning",
        }
      )
        .then(() => {
          deletePerson(data.id).then((response) => {
            if (response.code === 200) {
              this.$message.success("删除成功");
              this.getPersonPage();
            }
          });
        })
        .catch(() => {});
    },
    handleAdd() {
      this.personDialog.title = "新增人员"
      this.personOrgDisable = true
      if (this.queryParams.orgId) {
        this.personOrgOptions = []
        this.personOrgOptions.push({
          id: this.queryParams.orgId,
          orgName: this.clickOrgName
        })
        this.personDialog.disabled = false;
        this.personForm = {
          postBigCateCode: undefined,
          postSmallCateCode: undefined,
          jobLevel: undefined,
          jobLevelSmall: undefined,
          orgId: this.queryParams.orgId,
          status: '0'
        };
        this.personDialog.open = true;
      } else {
        this.$message.error("请选择要添加人员所在的机构");
      }
    },
    handleImport(){
      this.$refs.fileImport.fileImportShow(this.queryParams.orgId)
    },
    exportCustomBtn(){
      if (!this.queryParams.orgId){
        this.$message.error("请先选择机构！")
        return
      }
      this.exportDialog.open = true
    },
    exportCustom() {
      this.allEngLishName.forEach(item => {
        if (this.exportForm.exportColumn.indexOf(item) === -1){
          this.hideColumn.push(item)
        }
      })
      this.download(
        "org/exportCustom",
        {
          ...this.queryParams,
          hideColumn: this.hideColumn.join(","),
          leaderType: "",
          // leaderType: this.exportForm.leaderType.join(","),
        },
        this.clickOrgName + `人员信息.xlsx`
      );
      this.exportDialog.open = false
    },
    submitPersonForm() {
      this.$refs["personForm"].validate((valid) => {
        if (valid) {
          if (this.personForm.id) {
            updatePerson(this.personForm).then((response) => {
              this.$message.success("修改成功");
              this.personDialog.open = false;
              this.getPersonPage();
            });
          } else {
            addPerson(this.personForm).then((response) => {
              this.$message.success("添加成功");
              this.personDialog.open = false;
              this.getPersonPage();
            });
          }
        }
      });
    },
    handleSizeChange(val) {
      this.queryParams.pageNum = 1;
      this.queryParams.pageSize = val;
      this.getPersonPage();
    },
    handleCurrentChange(val) {
      this.queryParams.pageNum = val;
      this.getPersonPage();
    },
    handleEditOrg() {
      if (!this.orgId) {
        this.$message.error("请先选择目标机构！");
      } else {
        if(this.orgForm.orgLevel == '0'){
          this.isDisabled = false
        }else{
          this.isDisabled = true
        }
        this.orgPid = this.orgSelectPid;
        this.orgDialog.open = true;
        this.orgDialog.title = "修改机构";
        this.showAddBtn = false;
        this.addFlag = "0";
      }
    },
    handleDelOrg() {
      if (!this.orgId) {
        this.$message.error("请先选择目标机构！");
      } else if (this.orgSelectPid === "0") {
        this.$message.error("该机构无法删除！");
      } else {
        this.$confirm(
          "点击确认后，此机构会被永久删除, 请确认此项操作？",
          "删除机构",
          {
            confirmButtonText: "确认",
            cancelButtonText: "取消",
            type: "warning",
          }
        )
          .then(() => {
            deleteOrg(this.orgId).then((response) => {
              if (response.code === 200) {
                this.$message.success("删除成功");
                this.getTree();
                this.orgId = "";
                this.orgInfoForm = {
                  organizationAdmin: {},
                  organizationSingle: {},
                  organizationWork: {},
                  organizationCause: {},
                  departmentLead: {},
                  departmentLeadDeputy: {},
                  sameDepartmentLead: {},
                  internalLead: {},
                  internalLeadDeputy: {},
                  sameInternalLead: {},
                };
              }
            });
          })
          .catch(() => {});
      }
    },
    handleAddOrg() {
      if (!this.orgId) {
        this.$message.error("请先选择目标机构！");
      } else {
        this.orgPid = this.orgId;
        this.orgDialog.open = true;
        this.orgDialog.title = "新增机构";
        this.showAddBtn = true;
        this.saveOrgForm = this.orgForm;
        this.orgForm = {
          organizationAdmin: 0,
          organizationSingle: 0,
          organizationWork: 0,
          organizationCause: 0,
          departmentLead: 0,
          departmentLeadDeputy: 0,
          sameDepartmentLead: 0,
          internalLead: 0,
          internalLeadDeputy: 0,
          sameInternalLead: 0,
        };
        this.orgForm.pid = this.orgId;
        this.addFlag = "1";
        this.isDisabled = true;
        console.log("orgForm", this.orgForm);
      }
    },
    submitOrgForm() {
      this.$refs["orgForm"].validate((valid) => {
        if (valid) {
          if (this.orgForm.id) {
            updateOrg(this.orgForm).then((response) => {
              this.$message.success("修改成功");
              this.orgDialog.open = false;
              this.getTree();
            });
          } else {
            addOrg(this.orgForm).then((response) => {
              this.$message.success("添加成功");
              this.orgDialog.open = false;
              this.getTree();
              this.orgForm = JSON.parse(JSON.stringify(this.saveOrgForm));
            });
          }
        }
      });
    },
    setOrg() {
      this.$refs["orgForm"].validate((valid) => {
        if (valid) {
          if (this.orgForm.id) {
            updateOrg(this.orgForm).then((response) => {
              this.$message.success("修改成功");
              this.getTree();
            });
          } else {
            addOrg(this.orgForm).then((response) => {
              this.$message.success("添加成功");
              // this.getTree();
              // this.orgForm = JSON.parse(JSON.stringify(this.saveOrgForm));
            });
          }
        }
      });
    },
    /** 树节点鼠标移入移出 */
    mouseenter(data) {
      this.$set(data, "show", true);
    },
    mouseleave(data) {
      this.$set(data, "show", false);
    },
  },
};
</script>

<style scoped lang="scss">
.home {
  .el-card__body {
    padding: 10px 10px;
  }
  .org-content {
    display: flex;
  }
  blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #eee;
  }
  hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee;
  }
  .col-item {
    margin-bottom: 20px;
  }

  ul {
    padding: 0;
    margin: 0;
  }

  font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  color: #676a6c;
  overflow-x: hidden;

  ul {
    list-style-type: none;
  }

  h4 {
    margin-top: 0px;
  }

  h2 {
    margin-top: 10px;
    font-size: 26px;
    font-weight: 100;
  }

  p {
    margin-top: 10px;

    b {
      font-weight: 700;
    }
  }

  .update-log {
    ol {
      display: block;
      list-style-type: decimal;
      margin-block-start: 1em;
      margin-block-end: 1em;
      margin-inline-start: 0;
      margin-inline-end: 0;
      padding-inline-start: 40px;
    }
  }
}
.tree-wrapper {
  overflow-y: auto;
  ::v-deep .custom-tree-node {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    position: relative;
    width: 100%;
    overflow: hidden;
    i {
      margin-right: 10px;
      color: #97a8be;
    }
    .bt-add {
      color: #20a0ff;
    }
    .bt-edit {
      color: #38dcec;
    }
    .bt-final {
      color: #67c23a;
    }
    .bt-delete {
      color: red;
    }
    .node-title {
      display: block;
      width: 94%;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .tree-bts {
      position: absolute;
      right: 0px;
    }
  }
}
</style>

